<template>
  <div class="audition87">
    <p>1. 伪类选择器是css2版本中的旧写法，相对于css3中伪元素的的新写法兼容性会更好。</p>
    <p>2. 伪元素只能在一个选择器中出现一次，且需要配合content属性一起使用</p>
    <p>3. 伪元素不会出现在DOM中，所以不能通过js来进行操作，仅仅是在渲染层加入而已</p>
    <h3>css3引入的伪元素：</h3>
    <p>
      <span class="indient">1、 ::after  //在xxx之后插入内容</span><br />
      <span class="indient">2、 ::before     // 在xxx之前插入内容</span><br />
      <span class="indient">3、 ::first-letter  //选择xxx元素的首字母</span><br />
      <span class="indient">4、 ::first-line   //选择xxx元素的首行</span><br />
      <span class="indient"> 5、::selection  //选择用户选择的元素部分</span>
    </p>
  </div>
</template>

<script>
export default {
  name: 'Audition87',
}
</script>

<style>

</style>